{% extends "layout.html" %}
{% load i18n static %}

{% block extrastyle %}
    {{ block.super }}
    <style>
        .import-form {
            max-width: 600px;
            margin: 20px auto;
            background: #f8f9fa;
            padding: 20px;
            border-radius: 4px;
            border: 1px solid #e9ecef;
        }

        .errorlist {
            color: #dc3545;
            list-style: none;
            padding: 0;
            margin-bottom: 1rem;
        }
    </style>
{% endblock %}

{% block content %}
    <div id="content-main">

        <h1>{% trans "导入Excel数据" %}</h1>

        <div class="import-form">
            <form method="post" enctype="multipart/form-data">
                {% csrf_token %}

                {% if error %}
                    <ul class="errorlist">
                        <li>{{ error }}</li>
                    </ul>
                {% endif %}

                {% if errors %}
                    <ul class="errorlist">
                        {% for err in errors %}
                            <li>{{ err }}</li>
                        {% endfor %}
                    </ul>
                {% endif %}
                <div class="help">
                    {% trans "支持xlsx格式，最大文件大小：10MB<br>请先下载模板并按照模板格式填写数据" %}
                    <br>
                </div>
                <fieldset class="module aligned">
                    <div class="form-row">
                        <label for="id_file">{% trans "选择Excel文件" %}:</label>
                        <input type="file" name="file" id="id_file" class="form-control" accept=".xlsx">
                    </div>
                </fieldset>

                <div class="submit-row">
                    <input type="submit" value="{% trans '导入' %}" class="btn btn-success" name="_import">
                    <a href="{{ cancel_url }}" class="btn btn-info">{% trans "取消" %}</a>
                </div>
            </form>
        </div>
    </div>

{% endblock %}

